const path = require('path');
const { ipcRenderer } = require('electron');
const { $ } = require('./helper');

let musicFilesPath = [];

$('selectMusic').addEventListener('click', e => {
  ipcRenderer.send('open-music-file');
});

$('addMusic').addEventListener('click', () => {
  ipcRenderer.send('add-tracks', musicFilesPath);
});

const renderListHTML = pathes => {
  const musicList = $('musicList');
  const musicItemsHTML = pathes.reduce((curr, prev) => {
    curr += `<li class="list-group-item">${path.basename(prev)}</li>`;
    return curr;
  }, '');
  musicList.innerHTML = `<ul class="list-group">${musicItemsHTML}</ul>`;

};

ipcRenderer.on('selected-file', (event, path) =>{
  if (Array.isArray(path)) {
    renderListHTML(path);
    musicFilesPath = path;
  }
});
